<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta
      name="viewport"
      content="initial-scale=1.0, user-scalable=no, width=device-width"
    />
    <title>文本标记</title>
    <script src="c:/windows/style"></script>
    <link
      rel="stylesheet"
      href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"
    />
    <style>
      html,
      body,
      #container {
        margin: auto;
        height: 500px;
        width: 700px;
      }
    </style>
  </head>
  <body>
    <div id="container"></div>
    <script type="text/javascript">
      window._AMapSecurityConfig = {
        securityJsCode: 'c5b3373591dcf4cc8c26437d2e1e0865',
      }
    </script>
    <script
      type="text/javascript"
      src="https://webapi.amap.com/maps?v=2.0&key=9459c43cfd26752214a04ca5de3c7db5"
    ></script>
    <script type="text/javascript">
      var map = new AMap.Map('container', {
        viewMode: '3D',
        zoom: 15,
        center: [113.6373529179, 34.752323395024],
        resizeEnable: true,
      })

      // 创建纯文本标记
      var text = new AMap.Text({
        text: '这是我公司',
        anchor: 'center', // 设置文本标记锚点
        draggable: true,
        cursor: 'pointer',
        // angle: 10, // 设置文本标记旋转角度
        style: {
          padding: '.75rem 1.25rem',
          'margin-bottom': '1rem',
          'border-radius': '.25rem',
          'background-color': 'white',
          width: '15rem',
          'border-width': 0,
          'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
          'text-align': 'center',
          'font-size': '20px',
          color: 'blue',
        },
        position: [113.428296, 34.776551],
      })
      var m3 = new AMap.Marker({
        position: [113.428338, 34.775148],
        icon: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png',
      })
      map.add(m3)
      text.setMap(map)
    </script>
  </body>
</html>
